<script setup lang="ts">
import {PropType, reactive, ref} from "vue";
  import { useRenderIcon } from "@/components/ReIcon/src/hooks";
  import Delete from "@iconify-icons/ep/delete";
  import EditPen from "@iconify-icons/ep/edit-pen";
  import { useRoute, useRouter } from "vue-router";
  import { insertApplicationInfo, updateApplicationInfo} from "@/api/system";
  import { toRaw } from "vue";
  import {ElMessage} from "element-plus";
  import {useUserStoreHook} from "@/store/modules/user";
  import {useApplication} from "@/views/application/applicationList/utils/hook";
  const route = useRoute();
  const router = useRouter();
  let dialogTree = ref(false)
  let rowData = ref({});
  let formRef = ref(null);
  let roleOptions = ref([]);
  let loading = ref(false);
  let tableData = ref([]);
  let formVisible = ref(false);
  let formTitle = ref("新增");
  let title = "";

  const props = defineProps({
    onSearch: {
      type: Function,
      default: null
    }
  });

const nickname = ref(useUserStoreHook()?.nickname);


let form = reactive({
    createBy: "",
    updateBy: "",
    applicationId: "",
    applicationCode: "",
    applicationName: "",
    applicationDescription: "",
    developmentTeam: "",
    versionNumber: "1.0"
  });
  let row = ref({
    applicationId: "",
    title: "",
    status: "",
    applicationCode: "",
    applicationName: '',
    applicationDescription: "",
    developmentTeam: "",
    versionNumber: "",
    createTime: "",
    updateTime: "",
    createBy: "",
    updateBy: "",
    page: "1",
    pageSize: "10",
    statusName: "",
  });

  const addRule = {
    applicationCode: [{ required: true, message: "请输入应用编码", trigger: "blur" }],
    applicationName: [{ required: true, message: "请输入应用名称", trigger: "blur" }],
    versionNumber: [{ required: true, message: "请输入应用版本号", trigger: "blur" }],
  };


  //菜单
  const cropper = data => {
    form.value.title2 = data.checName;
  };

  function fillForm(row) {
    form.applicationId = row.applicationId
    form.applicationCode = row.applicationCode
    form.applicationName = row.applicationName
    form.applicationDescription = row.applicationDescription
    form.developmentTeam = row.developmentTeam
    form.versionNumber = row.versionNumber
  }
  //提交
  const insertApp = async (row) => {
    await formRef.value?.validate().catch(err => {
      ElMessage.error("必填项不能为空")
      throw err
    })
    form.createBy = nickname.value
    form.updateBy = nickname.value
    if(form.applicationId==null||form.applicationId==""){
      await insertApplicationInfo(toRaw(form)).then(res=>{
        if(res.code==500){
          ElMessage.error("注册应用失败："+res.msg+"!")
        }else{
          ElMessage.success("注册应用成功!")
          dialogTree.value = false
          props.onSearch();
        }
      });
    }else{
      await updateApplicationInfo(toRaw(form)).then(res=>{
        if(res.code==500){
          ElMessage.error("修改应用失败："+res.msg+"!")
        }else{
          ElMessage.success("修改应用成功!")
          dialogTree.value = false
          props.onSearch();
        }
      });
    }

    setTimeout(() => {
      loading.value = false;
    }, 500);
  };

  //取消
  function resetForm(formEl) {
    if (!formEl) return;
    formEl.resetFields();
    dialogTree.value = false
  }

  //新增和修改子集
  const openDialog = (flag = "新增", row = {}) => {
    formVisible.value = true;
  };
  //删除子集
  const handleDelete = () => { };
  //是否有效
  const onChange = () => { };
  //取消添加子集
  const closeDialog = () => {
    formVisible.value = false;
  };

  defineExpose({
    dialogTree,
    fillForm
  });



</script>
<template>
  <el-dialog title="" v-model="dialogTree" width="40%" style="min-height:400px;" v-if="form.applicationId==null||form.applicationId==''">
    <el-form ref="formRef" :inline="false" :model="form" :label-width="250"
      class="search-form bg-bg_color w-[99/100] pl-8 pt-[12px] overflow-auto" :rules="addRule">
      <h1 style="margin: 10px 0 20px">应用注册</h1>
      <el-form-item label="应用编码：" prop="applicationCode">
        <el-input v-model="form.applicationCode" placeholder="请输入应用编码" class="!w-[360px]" />
      </el-form-item>
      <el-form-item label="应用名称：" prop="applicationName">
        <el-input v-model="form.applicationName" placeholder="请输入应用名称" class="!w-[360px]" />
      </el-form-item>
      <el-form-item label="应用描述：" prop="applicationDescription">
        <el-input v-model="form.applicationDescription" placeholder="请输入应用描述" class="!w-[360px]" />
      </el-form-item>
      <el-form-item label="开发团队：" prop="developmentTeam">
        <el-input v-model="form.developmentTeam" placeholder="请输入开发团队" class="!w-[360px]" />
      </el-form-item>
      <el-form-item label="应用版本号：" prop="versionNumber">
        <el-input v-model="form.versionNumber" placeholder="默认为1.0" class="!w-[360px]" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" :loading="loading" @click="insertApp">
          提交
        </el-button>
        <el-button @click="resetForm(formRef)"> 取消 </el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
  <el-dialog title="" v-model="dialogTree" width="40%" style="min-height:400px;" v-else>
    <el-form ref="formRef" :inline="false" :model="form" :label-width="250"
             class="search-form bg-bg_color w-[99/100] pl-8 pt-[12px] overflow-auto" :rules="addRule">
      <h1 style="margin: 10px 0 20px">应用修改</h1>
      <el-form-item label="应用编码：" prop="applicationCode">
        <el-input v-model="form.applicationCode" placeholder="请输入应用编码" class="!w-[360px]" disabled/>
      </el-form-item>
      <el-form-item label="应用名称：" prop="applicationName">
        <el-input v-model="form.applicationName" placeholder="请输入应用名称" class="!w-[360px]" />
      </el-form-item>
      <el-form-item label="应用描述：" prop="applicationDescription">
        <el-input v-model="form.applicationDescription" placeholder="请输入应用描述" class="!w-[360px]" />
      </el-form-item>
      <el-form-item label="开发团队：" prop="developmentTeam">
        <el-input v-model="form.developmentTeam" placeholder="请输入开发团队" class="!w-[360px]" />
      </el-form-item>
      <el-form-item label="应用版本号：" prop="versionNumber">
        <el-input v-model="form.versionNumber" placeholder="默认为1.0" class="!w-[360px]" />
      </el-form-item>
      <el-form-item>
        <el-button type="primary" :loading="loading" @click="insertApp">
          提交
        </el-button>
        <el-button @click="resetForm(formRef)"> 取消 </el-button>
      </el-form-item>
    </el-form>
  </el-dialog>
</template>
<style lang="scss" scoped></style>
